<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>音频可视化</title>
    <link rel="stylesheet" href="../global/public.module.less">
    <link rel="stylesheet" lang="less" href="./style.less">
</head>

<body>
    <div class="music">
        <button class="start">开始</button>
        <div class="title" id="HI">HI</div>
        <div class="title">MUSIC DJ</div>
        <audio src="https://three-statices.oss-cn-hangzhou.aliyuncs.com/Visual%20audio%20track/ajl.mp3"></audio>
       <ul>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
        <li>
            <div>
                <div></div>
            </div>
        </li>
       </ul>
    </div>
</body>
<script type="module" src="./main.ts"></script>

</html>